<template>
	<view class="container" style="display: grid;">

		<input class="input-search" confirm-type="search" placeholder="请输入游玩路线关键字" @confirm="beganSearch"
			@input="checkSearchContent" v-model="searchContent" @focus="openLocationPicker" />
		<image style="position: absolute; height: 22px;width: 22px;right: 30px;top: 26px;z-index: 2;background-color: #FFFFFFff;"
			src="/static/page-home-icon-search-copy.png" @tap="beganSearch" @click="beganSearch"></image>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				searchContent: '',
				href: 'https://uniapp.dcloud.io/component/README?id=uniui',
				searching: false,
				dataList: [{
					title: 'ss'
				}, {
					title: 'ss1'
				}]
			}
		},
		methods: {
			clickBack() {
				uni.navigateBack({
					delta: 1,
					animationType: 'slide-out-left',
					animationDuration: 1100
				})
			},
			// checkSearchContent(e) {
			// 	this.searchContent = e.detail.value
			// 	console.log("checkSearchContent",this.searchConten)
			// },

			beganSearch(e) {
				console.log("beganSearch:", this.searchContent)
				uni.navigateTo({
					url: "/pages/searchResult/searchResult"
				})
			},
			openLocationPicker() {
				if (!this.searching) {
					uni.chooseLocation({
						success: (res) => {
							this.searchContent = res.name;
							console.log('选择的地址:', res);
						},
						fail: (err) => {
							console.log('选择地址失败:', err);
						}
					});
				}
			}

		}
	}
</script>

<style>
	.input-search {
		background-color: #fff;
		border-radius: 10px;
		font-size: 16;
		width: auto;
		padding: 14px;
		margin: 12px;
		border: 1px solid #E5E5E5;
	}

	.container {
		position: fixed;
		background-color: #fff;
		width: 100%;
		height: 100%;
		display: flow;
	}
</style>